<template>
    <div>
        <Row type="flex" justify="start" :gutter="20" class="table-header">
            <Col>营口科达运输有限公司>车队1</Col>
            <Col>日期：2019年6月</Col>
        </Row>
        <div>
            <Table stripe :columns="columns1" :data="data1"></Table>
        </div>
        <div class="mt20">
            <Table stripe :columns="columns2" :data="data2"></Table>
        </div>
        <div class="mt20">
            <Table stripe :columns="columns3" :data="data3"></Table>
        </div>
    </div>
</template>

<script>
export default {
  name: 'tableOne',
  data () {
    return {
      columns1: [
        {
          title: '风险排查诊改评估',
          align: 'center',
          children: [
            {
              title: '主要风险',
              key: 'a1'
            }, {
              title: '上月次数',
              key: 'a2'
            }, {
              title: '处警次数',
              key: 'a3'
            }, {
              title: '本月次数',
              key: 'a4'
            }, {
              title: '目标值',
              key: 'a5'
            }, {
              title: '诊改效果评估',
              key: 'a6'
            }, {
              title: '改进效果空间',
              key: 'a7'
            }
          ]
        }
      ],
      columns2: [
        {
          title: '隐患排查诊改评估',
          align: 'center',
          children: [
            {
              title: '主要隐患',
              key: 'a1'
            }, {
              title: '上月次数',
              key: 'a2'
            }, {
              title: '处警次数',
              key: 'a3'
            }, {
              title: '本月次数',
              key: 'a4'
            }, {
              title: '目标值',
              key: 'a5'
            }, {
              title: '诊改效果评估',
              key: 'a6'
            }, {
              title: '改进效果空间',
              key: 'a7'
            }
          ]
        }
      ],
      columns3: [
        {
          title: '总体评估',
          align: 'center',
          children: [
            {
              title: '本月风险概率',
              key: 'a1'
            }, {
              title: '环比变化',
              key: 'a2'
            }, {
              title: '总处警次数',
              key: 'a3'
            }, {
              title: '近半年风险降低速度',
              key: 'a4'
            }, {
              title: '风险诊改目标值',
              key: 'a5'
            }, {
              title: '改进效果空间',
              key: 'a6'
            }
          ]
        }
      ],
      data1: [],
      data2: [],
      data3: []
    }
  },
  mounted () {
    let data = []
    let data1 = []
    for (let i = 0; i < 3; i++) {
      data.push({
        a1: '前撞报警',
        a2: 23,
        a3: 6,
        a4: 12,
        a5: 5,
        a6: '风险概率环比下降1.2%',
        a7: '0.32%'
      })
    }
    for (let i = 0; i < 3; i++) {
      data1.push({
        a1: '7.9%',
        a2: '-1.2%',
        a3: 332,
        a4: '12.2%',
        a5: '5.2%',
        a6: '1.2%'
      })
    }
    this.data1 = [data[0]]
    this.data2 = data
    this.data3 = data1
  }
}
</script>

<style scoped>
    .table-header {
        margin-bottom: 10px;
        font-size: 14px;
        font-weight: bold;
    }
</style>
